<extend name="./Public/templete/base.html"/>
<!-- 标题   -->
<block name="title">
  <title>添加新的会议记录</title>
</block>
</style>
<!-- 添加该页面对应需要的css文件 -->
<block name="link">
  <link rel="shortcut icon" src="./favicon.ico" />
  <link rel="stylesheet" type="text/css" href="../../../Public/source/layui/css/layui.css">
  <link rel="stylesheet" type="text/css" href="../../../Public/source/css/manage.css">
</block>
<!-- 右下侧的主体内容 主要内容在此处写 -->
<block name="content">
    <div class="layui-body">
        <div style="padding: 15px;">
<!-- 我的代码 -->
  <!-- 一个简单的页面头部 -->
  <i class="layui-icon layui-icon-face-smile-b" style="font-size: 20px;"></i><label>&nbsp;添加新的会议记录</label>
   <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;"></fieldset>
 <form class="layui-form"> 
  <!-- 会议日期的选择 -->
     <div class="layui-inline" style="margin-bottom: 10px;">
       <label class="layui-form-label">会议日期</label>
        <div class="layui-input-inline">
          <input class="layui-input" id="test11" placeholder="yyyy-mm-dd" type="text" autocomplete="off">
        </div>
     </div>
  <!-- 会议类型的选择 --> 
     <div class="layui-inline" style="display:block;">
       <label class="layui-form-label">会议类型</label>
       <div class="layui-input-inline" style="padding-bottom: 10px;width: 186.4px;height: 38px;">
           <select lay-filter="aihao" id="sort">
               <option value="1">思政例会</option>
               <option value="2">教师指导</option>
               <option value="3" selected="">培训会议</option>
              </select>
       </div>
     </div>
  <!-- 主讲人的选择 -->
     <div class="layui-inline" style="padding-bottom: 10px;display:block;">
      <label class="layui-form-label">主讲人</label>
         <div class="layui-input-inline">
          <input class="layui-input" type="text" id="host" autocomplete="off">
        </div>
     </div>
  <!-- 参会人员的选择 -->
  <div class="layui-form-item">
    <label class="layui-form-label">参会人员</label>
    <div class="layui-input-block" id="member">    
    </div>
  </div>
  <!-- 标题和内容 -->
     <div class="layui-form-item">
        <div class="layui-input-block" style="width: 80%;">
           <input name="title" lay-verify="title" autocomplete="off" placeholder="输入会议标题..." class="layui-input" type="text" id="title">
        </div>
        <div class="layui-input-block" style="width: 80%;margin-top: 10px;">
           <textarea placeholder="请输入内容..." class="layui-textarea" id="content"></textarea>
        </div>
     </div>
   <!-- 文件上传 -->
     <div class="layui-upload">
      <button type="button" class="layui-btn layui-btn-normal" id="test8" style="margin-top: 10px;margin-left: 100px;">选择文件</button>
      <button type="button" class="layui-btn" id="test9" style="margin-top: 20px; margin-bottom: 10px;">开始上传</button>
   </div>
    <input type="hidden" id="startname">
    <input type="hidden" id="savename">
  <!-- 提交和重置按钮键 -->
      <div class="layui-input-block">
         <!-- 提交啦啦啦 -->
         <input type="button" class="layui-btn" id="Submit" value="立即提交">
         <!-- html自带的重置功能 -->
         <input type="reset" class="layui-btn layui-btn-primary">
      </div>
    </form>   
<!-- 我的代码-->
        </div>
    </div>
</block>  
<!-- 引入或写js代码 -->
<block name="js">
  <script src="../../../Public/source/layui/layui.js"></script>
  <script src="../../../Public/source/jquery-3.2.1.js"></script>
  <script>
 //会议类型的下拉框
  layui.use(['form'], function(){
});
 //人员选择
  $(function(){  
    $.ajax({
     type:"POST",  
     url:"{:U('Conference/getname')}",//后台提供接口 
     dataType: "json", 
     success:function(data){  
    for( i in data){
       var button="<input type='checkbox' title='"+data[i].name+"' name='test' value='"+data[i].name+"'/>";
       $("#member").append(button);
       layui.form.render('checkbox');
         }
      },
      error:function(data){  
          alert("连接超时");  
       }  
          }); 
    });
 //日期选择
  layui.use('laydate', function(){
  var laydate = layui.laydate;
  laydate.render({
    elem: '#test11'
    ,format: 'yyyy-MM-dd'
    });
  });
//表单提交
$("#Submit").click( function(){
     var date1 = $("#test11").val();
     var host1 = $("#host").val();
     var member1 = "";
      $('input:checkbox[name=test]:checked').each(function(i){
      if(0==i){
      member1 = $(this).val();
      }else{
      member1 += (","+$(this).val());
     }
     });
     console.log(member1);
     //var member1 = $("#member").val();
     var content1 = $("#content").val();
     var title1 = $("#title").val();
     var sort1 = $("#sort option:selected").text(); 
     var startname1 = $("#startname").val();
     var savename1 = $("#savename").val();
     $.ajax({
       type:"POST",
       async:false,
       dataType:'json',
       url:"{:U('Conference/CreateConfer')}",//后台提供接口
       data:{
           date:date1,
           host:host1,
           member:member1,
           content:content1,
           title:title1,
           sort:sort1,
           filename:startname1,
           filesave:savename1
       }, 
       success:function(data)
       {
            console.log(data);
            layer.open({
               title:'提示',
               content: '提交成功',
               area: ['450px', '160px'],
               closeBtn: 2,
               time :2000,
           });
       },
       error:function(data)
       {
           layer.open({
               title:'提示',
               content: '请检查内容是否填写完整',
               btn: ['知道了'],
               area: ['500px', '180px'],
               closeBtn: 2,
           });
       }
     });
});
layui.use('element', function(){
      var element = layui.element;
    });
//文件上传
  layui.use('upload', function(){
  var $ = layui.jquery,
  upload = layui.upload;
  upload.render({
     elem: '#test8'
    ,type: 'file'
    ,url:"{:U('Conference/upload')}"//后台提供接口
    ,accept: 'file'
    ,auto: false
    ,bindAction: '#test9'
    ,done: function(res){    
      $('#startname').val(res[0]);
      $('#savename').val(res[1]);
      layer.open({
         title:'提示',
         content: '上传成功',
         btn: ['OK'],
         area: ['300px', '160px'],
         closeBtn: 2,
         time: 1500,
      });
    }
   ,error: function(){
      //请求异常回调
      layer.open({
         title:'提示',
         content: '上传失败',
         btn: ['知道了'],
         area: ['300px', '160px'],
         closeBtn: 2,
         time: 1500,
      });
    }
  });
});        
</script>
</block>